<template>
  <el-card>
    <template #header>
      <div class="clearfix">
        <span>客户列表</span>
        <el-button @click="router.push('/home/partner/investors/add')" style="float: right; padding: 3px 0" type="text">添加</el-button>
      </div>
    </template>
    <el-table :data="customersList" style="width: 100%">
      <el-table-column prop="id" label="序号" ></el-table-column>
      <el-table-column prop="loginAccount" label="登录账号" ></el-table-column>
      <el-table-column prop="customerName" label="客户姓名" ></el-table-column>
      <el-table-column prop="phoneNumber" label="手机号" ></el-table-column>
      <el-table-column prop="isInvestor" label="是否投资商" >
        <template #default="scope">
          {{ scope.row.isInvestor ? '是' : '否' }}
        </template>
      </el-table-column>
      <el-table-column prop="hasPoints" label="拥有积分" ></el-table-column>
      <el-table-column prop="hasChargingCard" label="是否开充电卡" >
        <template #default="scope">
          {{ scope.row.has_chargingCard ? '是' : '否' }}
        </template>
      </el-table-column>
      <el-table-column prop="accountLevel" label="账号等级" ></el-table-column>
      <el-table-column prop="realNameVerified" label="实名认证" ></el-table-column>
      <el-table-column prop="createdAt" label="创建时间">
        <template #default="scope">
          {{ scope.row.createdAt.substring(0, 10) }}
        </template>
      </el-table-column>
    </el-table>
  </el-card>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { fetchCustomersList } from "../../../../api/CustomersApi.ts";
import router from "../../../../router";

const customersList = ref([]);


const getCustomersList = async () => {
  const res = await fetchCustomersList();
  if (res.code === 200) {
    customersList.value = res.data
  }
};


getCustomersList();

</script>

<style scoped>
.el-card {
  margin-top: 20px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 0 #ffffff;
  outline: 0;
}
</style>
